<template>
  <yd-ls-layout title="门诊信息" :onfoot=false :tolfurl="urls" >
    <div class="yd-ls-height" ></div>
    <yd-ls-title lftit="出诊时间" style="margin-top: 0"></yd-ls-title>
    <yd-ls-default v-if="!seekInfo.length">暂无出诊信息</yd-ls-default>
    <div class="yd-accordion yd-ls-seekinfo-accordion">
      <div v-for="(items,index) in seekInfo" :key="index" ref="popup" @click="setPopupIndex(index)">
        <div class="yd-accordion-head">
          <div class="yd-accordion-head-content">
            <div class="yd-accordion-title yd-accordion-title-full"><span v-text="items.location"></span></div>
          </div>
          <i :class="{'yd-accordion-rotated' : hasPopup}"></i>
        </div>
        <div class="yd-accordion-content" :style="{height: index==0?'':'0'}">
          <div>
            <div class="yd-cell-item" v-for="(datas,ind) in items.schdules" :key="ind">
              <div class="yd-cell-left"><span class="yd-cell-icon"></span> <span>{{ datas.week }}<i> {{ datas.visit_time }} </i></span></div>
              <div class="yd-cell-right"><span>{{ datas.clinic_type }}</span></div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <yd-ls-title lftit="温馨提示"></yd-ls-title>
    <yd-ls-content>
      <div slot="content">
        由于突发原因导致出诊时间、出诊地点等内容上的更改，均以医院当天公布为准，如有需要，可拨打医院电话进行确认。
      </div>
    </yd-ls-content>
  </yd-ls-layout>
</template>

<script>
  import ydLsLayout from '../../../components/yd-ls-layout.vue'
  import ydLsTitle from '../../../components/yd-ls-title.vue'
  import ydLsContent from '../../../components/yd-ls-content.vue'
  import ydLsDefault from '../../../components/yd-ls-default.vue'
  import api from '../../../axios/api'

  export default {
    name: 'seekinfo',
    data() {
      return {
        urls: 'seekdetail.html#/',
        seekInfo: [],
        hasPopup: false
      }
    },
    created(){
      //TODO:初始化数据
      let drid = this.$route.query.drid || sessionStorage.drid
      // this.urls = `index.html#/seekdetail?drid=${drid}`
      this.getSeekInfo(drid)
      //TODO: 保证每次进入，都是第一个列表打开状态
      this.$nextTick(()=>{
        setTimeout(()=>{
          this.setPopupIndex(0)
        },100)

      })
    },
    methods: {
      init() {
       /* console.log(this.$refs)
        console.log(this.$refs.test)*/
      },
      getSeekInfo(drid) {
        this.$dialog.loading.open(api.default_loading_txt);
        this.axios.get(api.seek_info, {params:{drid: drid}})
        .then(m=>{
          let seek_info_data = m.data
          this.seekInfo = seek_info_data.data
          this.$dialog.loading.close()
        }).catch(err=>{
          this.$dialog.loading.close()
          this.$dialog.alert({mes: JSON.stringify(err)})
        })
      },
      setPopupIndex(ind) {
        let popup = this.$refs.popup
        for(let i=0; i<popup.length; i++) {
          popup[i].children[1].style.height = '0'
          popup[i].children[0].children[1].className = ''
        }
        popup[ind].children[1].style.height = ''
        popup[ind].children[0].children[1].className = 'yd-accordion-rotated'
      }
    },
    mounted() {
      this.init()
    },
    components: { ydLsLayout, ydLsTitle, ydLsContent, ydLsDefault }


  }
</script>

<style>
  .yd-ls-seekinfo-accordion .yd-accordion-content{
    background-color: aliceblue;
  }
  .yd-ls-seekinfo-accordion .yd-cell-left span i {
    padding-left: .3rem;
  }
  .yd-ls-seekinfo-accordion .has-height {
    height: 0
  }
</style>